<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>StudentInfo</title>
    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">

    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
<div id="modifyStudent">
    <form name="modifyStudent">
        <div class="form-group">
            <label for="id">ID:</label>
            <input type="text" class="form-control" name="id" id="id" th:value="${student_id.getId()}" disabled>
        </div>
        <div class="form-group">
            <label for="student_id">学生学号:</label>
            <input type="text" class="form-control" name="student_id" id="student_id" th:value="${student_id.getStudent_id()}">
        </div>
        <div class="form-group">
            <label for="student_name">学生姓名:</label>
            <input type="text" class="form-control" name="student_name" id="student_name" th:value="${student_id.getStudent_name()}">
        </div>
        <div class="form-group">
            <label for="student_clazz">学生班级:</label>
            <input type="text" class="form-control" name="student_clazz" id = "student_clazz" th:value="${student_id.getStudent_clazz()}">
        </div>
        <div class="form-group">
            <label for="student_phone">学生电话:</label>
            <input type="text" class="form-control" name="student_phone" id = "student_phone" th:value="${student_id.getStudent_phone()}">
        </div>
        <div class="form-group">
            <label for="student_QQ">学生QQ:</label>
            <input type="text" class="form-control" name="student_QQ" id = "student_QQ" th:value="${student_id.getStudent_QQ()}">
        </div>
    </form>
    <button id = "modify">更改信息</button>
</div>
<script >
    //字符串判空方法
    function isBlank(str){
        if(str == "" || str == null || str == undefined){
            return true;
        }else {
            return false;
        }
    }
    //添加用户js响应事件
    $("#modify").click(function(){
        var id = $("#id").val();
        var student_id = $("#student_id").val();
        var student_name = $("#student_name").val();
        var student_clazz = $("#student_clazz").val();
        var student_phone = $("#student_phone").val();
        var student_QQ = $("#student_QQ").val();
        //判断是否有未填项
        if(isBlank(student_id) || isBlank(student_name) || isBlank(student_clazz) || isBlank(student_phone) || isBlank(student_QQ)){
            window.confirm("请完善信息");
        }else {
            var param = {
                "id": id,
                "student_id": student_id,
                "student_name": student_name,
                "student_clazz": student_clazz,
                "student_phone": student_phone,
                "student_QQ": student_QQ
            };
            $.ajax({
                url:"/modifyStudent", //请求url
                data: param,    //请求参数
                async: true,    //是否异步
                success: function f(result) {
                    window.confirm(result.msg); //修改用户信息成功提示框
                    location.href = "students";    //重新加载界面，同步数据库信息
                }
            });

        }

    });
</script>
</body>
</html>